<template>
	<view class="main">
		<view class="bgviewtop">
			<view class="topview">
				<view class="top-left"><label class="lab-item-left"><span>{{item.title}}</span></label></view>
				<view v-if="item.salaryMax" class="top-right"><label
						class="lab-item-right">{{item.salaryMin}}~{{item.salaryMax}}{{item.unit}}</label></view>
				<view v-else-if="!item.salaryMax&&!item.salaryMin" class="top-right">
					<label class="lab-item-right">面议</label>
				</view>
				<view v-else class="top-right"><label class="lab-item-right">{{item.salaryMin}}{{item.unit}}</label>
				</view>
			</view>
			<view class="bgviewtop_buttomview">
				<view class="addr">
					<view style="display: flex;flex-direction: row;color: #424242;">
						<!-- 工作地点:{{item.address}} -->
						<u-icon name="map" color="#A1A1A1" size="13"></u-icon>
						{{item.cityName?item.cityName:''}}{{item.areaName?item.areaName:''}}
					</view>
					<view style="color: #A1A1A1;font-size: 12px;">{{item.createTime}}发布</view>
				</view>
			</view>
		</view>
		<!-- <view class="userInfo">
			<image style="width: 50px;height: 50px;margin-right: 10px;"
				:src="item.avatar?item.avatar:'https://xgr.oss-cn-hangzhou.aliyuncs.com/icon/images/default-avatar.png'">
			</image>
			<view class="" style="display: flex;flex-direction: column;jus">
				<view style="color: #0F0F0F;font-family:PingFang SC;font-size: 14px;font-weight: bold;">
					{{item.publisher}}
				</view>
				<view style="color:#0575FF ;background-color:#E4F0FF;font-size: 12px;padding: 2px;">
					{{item.isEnterprise==1?"企业认证":item.isRealName==1?"实名认证":""}}
				</view>
			</view>
		</view> -->
		<view class="userInfo">
			<view style="display: flex;flex-direction: row;">
				<image style="width: 50px;height: 50px;margin-right: 10px;"
					:src="item.avatar?item.avatar:'https://xgr.oss-cn-hangzhou.aliyuncs.com/icon/images/default-avatar.png'">
				</image>
				<view class="" style="display: flex;flex-direction: column;width: auto;">
					<view style="display: flex;">
						<view style="color: #0F0F0F;font-family:PingFang SC;font-size: 14px;font-weight: bold;">
							{{item.contractPeople&&item.contractPeople != '先生'?item.contractPeople.charAt(0) + '先生':'先生'}}
						</view>
						<view v-if="item.isEnterprise == 1||item.isRealName==1"
							style="color:#0575FF ;background-color:#E4F0FF;font-size: 12px;padding: 2px;margin-left: 10rpx;border-radius: 4rpx;">
							{{item.isEnterprise==1?"企业认证":item.isRealName==1?"实名认证":""}}
						</view>
					</view>
					<view
						style="color: #636363;font-size: 12px;margin-top: 10rpx; width: 50vw; overflow: hidden;text-overflow: ellipsis; white-space: nowrap; ">
						{{item.companyName?item.companyName:''}}
					</view>
				</view>
			</view>
			<view style="display: flex;text-align: center;justify-items: center;align-items: center;">
				<u-icon @click="jubao()" label-pos="right" label="举报" name="warning"></u-icon>
			</view>
		</view>
		<view class="testview">
			<text style="height:45px;color: blueviolet;font-size: 14px;">如遇到办证收费，刷单，传销，诱导买车等行为，请立即向天下工人平台举报！</text>
		</view>
		<view class="jobInfo">
			<view class="tag_container">
				<zyTag ref="zyAddTag" v-for="(item,index) in taglist" :text="item" addible />
			</view>
			<view class="centerview">
				<text
					style="font-size: 30rpx;color: #424242; word-spacing:15rpx;line-height: 50rpx;">{{item.workContent}}</text>
			</view>
		</view>
		<view class="jobAddress">
			<!-- <view style="display: flex;flex-direction: row;text-align: center;align-items: center;">
				<image style="width: 25px;height: 25px;" src="../../static/img/jobaddress.png">
				</image>
				<view style="color:#3D3D3D; font-size: 16px;font-family:font-family: PingFang SC; text-align: center;font-weight: 400;">工作地点</view>
			</view> -->
			<view v-if="item.lat">
				<text>工作地点：{{item.address}}</text>
				<map style="width: 100%; height: 200px;" :latitude="item.lat" :longitude="item.lon" :markers="covers">
				</map>
			</view>
			<view v-else>工作地点:{{item.address}}</view>

		</view>
		<view class="jobAddress" v-if="JSON.parse(item.contractWays).qrcode">
			<text>扫描二维码报名(长按保存二维码)</text>
			<view style="margin: 60rpx auto;">
				<image :showLoading="true" :src="JSON.parse(item.contractWays).qrcode" width="280rpx" height="280rpx"
					@click="click" :show-menu-by-longpress="true"></image>
			</view>

		</view>

		<view class="zanweiview">

		</view>
		<!-- 二者皆可 -->
		<view class="tool_bottom" v-if="item.contractMethod==2  & item.userId != userid"
			style="padding-bottom: 60rpx; padding-top: 20rpx;">

			<view class="tool_bottom" v-if="item.hasRegister==0">
				<!-- <view class="fabuview" v-if="item.contractMobile"> -->
				<!-- //电话号请求 -->
				<view class="fabuview" v-if="item.hasMobile">
					<!-- <button class="callbtn" @click="playtel(item)">电话联系</button> -->
					<!-- //电话号请求 -->
					<button class="callbtn" @click="callphone(0)">电话联系</button>
				</view>
				<!-- <view class="fabuview" v-if="JSON.parse(item.contractWays).Wx">
					<button class="callbtn" @click="copyWeChatId(item)">微信</button>
				</view> -->
				<!-- //电话号请求 -->
				<view class="fabuview" v-if="item.hasWx">
					<button class="callbtn" @click="callphone(1)">微信</button>
				</view>
				<!-- <view class="fabuview" v-if="JSON.parse(item.contractWays).email">
					<button class="callbtn" @click="copyWeChateml(item)">邮箱</button>
				</view> -->
				<!-- //电话号请求 -->
				<view class="fabuview" v-if="item.hasEmail">
					<button class="callbtn" @click="callphone(2)">邮箱</button>
				</view>
				<view class="fabuview">
					<button class="callbtn" @click="baoming(item)">报名</button>
				</view>
			</view>
			<view class="tool_bottom" v-if="item.hasRegister==1">
				<!-- <view class="fabuview" v-if="item.contractMobile"> -->
				<!-- //电话号请求 -->
				<view class="fabuview" v-if="item.hasMobile">
					<!-- <button class="callbtn" @click="playtel(item)">电话联系</button> -->
					<!-- //电话号请求 -->
					<button class="callbtn" @click="callphone(0)">电话联系</button>
				</view>
				<!-- <view class="fabuview" v-if="JSON.parse(item.contractWays).Wx">
					<button class="callbtn" @click="copyWeChatId(item)">微信</button>
				</view>
				<view class="fabuview" v-if="JSON.parse(item.contractWays).email">
					<button class="callbtn" @click="copyWeChateml(item)">邮箱</button>
				</view> -->
				<!-- //电话号请求 -->
				<view class="fabuview" v-if="item.hasWx">
					<button class="callbtn" @click="callphone(1)">微信</button>
				</view>
				<view class="fabuview" v-if="item.hasEmail">
					<button class="callbtn" @click="callphone(2)">邮箱</button>
				</view>
				<view class="fabuview">
					<button class="callbtn">已报名</button>
				</view>
			</view>
		</view>
		<!-- =========电话报名============ -->
		<view class="tool_bottom" v-if="item.contractMethod==0" style="padding-bottom: 60rpx; padding-top: 20rpx;">
			<!-- //电话号请求 -->
			<!-- <view class="fabuview" v-if="item.contractMobile"> -->
			<view class="fabuview" v-if="item.hasMobile">
				<!-- <button class="callbtn" @click="playtel(item)">电话联系</button> -->
				<!-- //电话号请求 -->
				<button class="callbtn" @click="callphone(0)">电话联系</button>
			</view>
			<!-- <view class="fabuview" v-if="JSON.parse(item.contractWays).Wx">
				<button class="callbtn" @click="copyWeChatId(item)">微信</button>
			</view>
			<view class="fabuview" v-if="JSON.parse(item.contractWays).email">
				<button class="callbtn" @click="copyWeChateml(item)">邮箱</button>
			</view> -->
			<!-- //电话号请求 -->
			<view class="fabuview" v-if="item.hasWx">
				<button class="callbtn" @click="callphone(1)">微信</button>
			</view>
			<view class="fabuview" v-if="item.hasEmail">
				<button class="callbtn" @click="callphone(2)">邮箱</button>
			</view>
		</view>
		<view class="tool_bottom" v-if="item.contractMethod==1 & item.userId != userid & item.hasRegister==0">
			<view class="fabuview">
				<button class="callbtn" @click="baoming(item)">报名</button>
			</view>
		</view>
		<view class="tool_bottom" v-if="item.contractMethod==1 & item.userId != userid & item.hasRegister==1">
			<view class="fabuview">
				<button class="callbtn">已报名</button>
			</view>
		</view>
		<canvas canvas-id="shareCanvas"
			style="position:absolute; top:-9999px; left:-9999px; width:300px; height:240px;">
		</canvas>
	</view>
</template>

<script>
	// import Index from "@/common/index-model.js"
	import zyTag from '../../components/zy-tag/zy-tag.vue'
	import Index from "../../common/index-model.js"
	let index = new Index();
	let that = null;
	export default {
		components: {
			zyTag
		},
		data() {
			return {
				item: {},
				taglist: [],
				contractMethod: 0,
				show: true,
				itemId: '',
				userid: '',
				shareImagePath: '', // 存储生成的图片路径
				//电话号请求
				phonenum: {}, //联系方式包括微信邮箱电话
				isInfoAll: '',
			}
		},
		onLoad(option) {
			// console.log('传过来的值是==666666666666666==', option)
			// this.getdataSource(option.index)
			this.itemId = option.cardID
			this.isInfoAll = option.isInfoAll
			let inviteUserId = option.inviteUserId

			this.userid = uni.getStorageSync('userid')
			console.log('传过来的值是==666666666666666==', option)

			uni.setStorageSync('inviteUserId', inviteUserId);
			// this.getdata(option.cardID)

			//电话号请求
			// this.getphonenum(this.itemId)
			this.addBrowseNum(this.itemId)
		},
		onShow() {
			this.getdata(this.itemId)
		},
		methods: {
			closeNotimestip() {
				this.showNotimes = false
			},
			closefillresume() {
				this.showfillresume = false
			},
			govip(code) {
				this.showNotimes = false
				let uid = uni.getStorageSync('userid')
				this.NavUrlRd('/pagesB/rechargeVip/rechargeVip?userId=' + uid + '&&entid=' + 0 + '&&code=' + code)
			},
			gosetinfo() {
				this.showisinfoall = false
				this.NavUrlRd('/pagesB/releaseWork/index')
			},
			closegosetinfo() {
				this.showisinfoall = false
			},
			fillresume() {
				this.showfillresume = false
				this.NavUrlRd('/pagesB/entRegister/entRegister?type=2')
			},
			generateShareImage() {
				let wage = ''
				if (this.item.salaryMax) {
					wage = `${this.item.salaryMin}~${this.item.salaryMax}${this.item.unit}`
				} else if (!this.item.salaryMax && !this.item.salaryMin) {
					wage = '面议'
				} else {
					wage = `${this.item.salaryMin}${this.item.unit}`
				}
				const ctx = uni.createCanvasContext('shareCanvas', this);
				const canvasWidth = 300; // 画布宽度
				const canvasHeight = 240; // 画布高度

				// 绘制背景（示例用纯色，可替换为网络/本地图片）
				ctx.setFillStyle('#ffffff');
				ctx.fillRect(0, 0, canvasWidth, canvasHeight);

				ctx.setFontSize(24);
				ctx.font = 'bold 24px sans-serif'; // 使用简单字体名称
				ctx.setFillStyle('#007AFF');
				ctx.setTextAlign('left');

				ctx.fillText(wage, 0, 20);

				ctx.setFontSize(18);
				ctx.setFillStyle('#666666');
				ctx.fillText(this.item.address, 0, 50);

				ctx.setFontSize(16);
				ctx.setFillStyle('#333333');
				const startY = 80; // 起始Y坐标
				const lineHeight = 20; // 行高
				const contentLines = this.item.workContent.split('\n');
				contentLines.forEach((line, index) => {
					ctx.fillText(line, 10, startY + index * lineHeight);
				});
				// ctx.fillText(this.item.workContent, 10, 80);


				// 生成图片
				ctx.draw(false, () => {
					uni.canvasToTempFilePath({
						canvasId: 'shareCanvas',
						success: (res) => {
							this.shareImagePath = res.tempFilePath; // 存储路径
						},
						fail: (err) => {
							console.error('生成图片失败:', err);
						}
					});
				});
			},
			wrapText(ctx, text, x, y, maxWidth, lineHeight) {
				// 先按换行符分割段落
				const paragraphs = text.split('\n');
				paragraphs.forEach(paragraph => {
					let line = '';
					// 逐字拼接检测宽度
					for (const char of paragraph) {
						const testLine = line + char;
						const metrics = ctx.measureText(testLine);
						if (metrics.width > maxWidth) {
							ctx.fillText(line, x, y);
							line = char; // 新行从当前字符开始
							y += lineHeight;
						} else {
							line = testLine;
						}
					}
					// 绘制剩余文字
					ctx.fillText(line, x, y);
					y += lineHeight; // 段落间换行
				});
			},
			jubao() {
				if (uni.getStorageSync('token')) {
					uni.navigateTo({
						url: "/pagesC/jubao/jubao?type=2&targetId=" + this.userid
					})
				} else {
					uni.navigateTo({
						url: "/pagesC/login/login"
					});
				}
			},
			//添加标签input框回车事件
			confirm() {
				this.tagAddList.push(this.addValue)
				this.addValue = ''
			},
			//通用跳转
			NavUrlRd(url) {
				if (uni.getStorageSync('token')) {
					index.navigate_to(url)
				} else {
					uni.navigateTo({
						url: "/pagesC/login/login"
					});
				}
			},
			baoming(item) {
				if (uni.getStorageSync('token')) {
					console.log('报名跳转传惨', this.itemId)
					if (this.item.userId == this.userid) {
						uni.showToast({
							title: '不能联系自己',
							icon: 'none'
						})
					} else {
						uni.navigateTo({
							url: "/pagesC/job/entryJob?data=" + this.itemId
						})
					}
				} else {
					index.navigate_to('../../pagesC/login/login');
				}
			},
			copyWeChatId(item) {
				if (uni.getStorageSync('token')) {
					// const weChatId = JSON.parse(item.contractWays).Wx;
					// 电话号请求
					const weChatId = this.phonenum.Wx;
					uni.setClipboardData({
						data: weChatId,
						success: function() {
							uni.showToast({
								title: '微信号已复制，请打开微信添加好友',
								icon: 'none'
							});
						}
					});
				} else {
					index.navigate_to('../../pagesC/login/login');
				}

			},
			copyWeChateml(item) {
				if (uni.getStorageSync('token')) {
					// const WeChateml = JSON.parse(item.contractWays).email;
					// 电话号请求
					const WeChateml = this.phonenum.email;
					uni.setClipboardData({
						data: WeChateml,
						success: function() {
							uni.showToast({
								title: '邮箱地址已复制',
								icon: 'none'
							});
						}
					});
				} else {
					index.navigate_to('../../pagesC/login/login');
				}

			},
			callphone(item) {
				if (uni.getStorageSync('token')) {
					this.getphonenum(this.itemId, item)
				} else {
					index.navigate_to('../../pagesC/login/login');
				}
			},
			playtel(item) {
				let token = uni.getStorageSync('token')
				if (uni.getStorageSync('token')) {
					let userid = uni.getStorageSync('userid')
					console.log('打电话时的userid是：', userid, 'orderid', this.itemId);
					if (this.item.userId == this.userid) {
						uni.showToast({
							title: '不能联系自己',
							icon: 'none'
						})
					} else {
						let orderid = this.itemId
						uni.makePhoneCall({
							//电话号请求
							phoneNumber: this.phonenum.mobile,
							// phoneNumber: item.contractMobile,
							success: function() {
								let data = {
									userId: this.item ? this.item.userId : '',
									orderId: orderid
								}
								console.log('打电话时请求的数据是：', data);
								index.getPublicUserMember(data, 'client/contact/phone/callPhone', 'post',
									res => {
										console.log('添加拨打电话记录成功！');
									})
							},
							fail: function() {
								console.log('拨打电话失败！');
							}
						});
					}
				} else {
					index.navigate_to('../../pagesC/login/login');
				}
			},
			//电话号请求
			getphonenum(id,item) {
				let url = '/client/recuitjob/contract/' + id
				index.getPublicUserMember({}, url, 'get', res => {
					if (res.data.code == 200 && res.data.success) {
						console.log('请求电话号', res.data.result)
						this.phonenum = res.data.result
						if (item == 0) {
							this.playtel()
						} else if (item == 1) {
							this.copyWeChatId()
						} else if (item == 2) {
							this.copyWeChateml()
						}
					}else if (res.data.code == 503 || res.data.code == 504) {
						console.log('无次数',res.data.code)
						let code = res.data.code?res.data.code:''
						
						uni.showModal({
							content: res.data.message,
							// content: '今日可用次数已用完，可前往app充值',
							confirmText: '确认',
							cancelText: '取消',
							  success: (res) => {
							    if (res.confirm) {
							      this.govip(code);
							    } else {
							      this.closeNotimestip();
							    }
							  }
						})
						// this.showNotimes = true
						// this.errmessage = res.data.message
					} else if (res.data.code == 501) {
						uni.showModal({
							content: res.data.message,
							confirmText: '确认',
							cancelText: '取消',
							  success: (res) => {
							    if (res.confirm) {
							      this.gosetinfo();
							    } else {
							      this.closegosetinfo();
							    }
							  }
						})
						// this.showisinfoall = true
						// this.errmessage = res.data.message
						console.log('请填写个人信息')
					} else if (res.data.code == 499) {
						uni.showModal({
							content: res.data.message,
							confirmText: '确认',
							cancelText: '取消',
							  success: (res) => {
							    if (res.confirm) {
							      this.fillresume();
							    } else {
							      this.closefillresume();
							    }
							  }
						})
						// this.showfillresume = true
						// this.errmessage = res.data.message
					} else {
						console.log('请求电话号失败', res)
					}
				})
			},
			getdata(id) {
				let url = ''
				let token = uni.getStorageSync('token')
				console.log('好活详情', token, id)
				if (token) {
					url = 'client/recuitjob/detail/' + id
					console.log('----------======-------', url)
					index.getPublicUserMember({}, url, 'get', res => {
						if (res.data.code == 200 && res.data.success) {
							console.log('aadsadasdas', res.data.result)
							this.item = res.data.result
							this.contractMethod = res.data.result.contractMethod
							this.generateShareImage()
							if (res.data.result.welfares) {
								this.taglist = res.data.result.welfares.split(",") //待完成
								console.log('福利标签', this.taglist)
							}
						} else {
							// index.show_tips(res.data.message)
							// return false
							url = 'client/recuitjob/detailNoSe/' + id
							console.log('----------======-------', url)
							index.getPublicMember({}, url, 'get', res => {
								if (res.data.code == 200 && res.data.success) {
									this.item = res.data.result
									this.contractMethod = res.data.result.contractMethod
									this.generateShareImage()
									if (res.data.result.welfares) {
										this.taglist = res.data.result.welfares.split(",") //待完成
										console.log('福利标签', this.taglist)
									}
								} else {
									index.show_tips(res.data.message)
									return false
								}
							})

							return false
						}
					})
				} else {
					url = 'client/recuitjob/detailNoSe/' + id
					console.log('----------======-------', url)
					index.getPublicMember({}, url, 'get', res => {
						if (res.data.code == 200 && res.data.success) {
							this.item = res.data.result
							this.contractMethod = res.data.result.contractMethod
							this.generateShareImage()
							if (res.data.result.welfares) {
								this.taglist = res.data.result.welfares.split(",") //待完成
								console.log('福利标签', this.taglist)
							}
						} else {
							index.show_tips(res.data.message)
							return false
						}
					})
				}
			},
			addBrowseNum(e) {
				let url = ''
				console.log("拿到e", e)
				url = 'client/recuitjob/addBrowseNum/' + e
				index.getPublicMember({}, url, 'put', res => {
					if (res.data.code == 200 && res.data.success) {

					} else {
						index.show_tips(res.data.message)
						return false
					}
				})
			},

			onShareAppMessage(res) {

				console.log("++++++++1111111++++++++++++++", res, uni.getStorageSync('userid'), uni.getStorageSync(
					'swiper_info'), this.itemId)
				if (res.from === 'button') { // 来自页面内分享按钮
				}
				if (this.shareImagePath) {
					return {
						title: this.item.title,
						path: '/pagesB/jobinfo/jobLeavetwoInfo?' + '&inviteUserId=' + uni.getStorageSync('userid') +
							'&cardID=' + this.itemId,
						imageUrl: this.shareImagePath
						// imageUrl: 'https://xgr.oss-cn-hangzhou.aliyuncs.com/icon/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20230327160119.png'
					}
				}

				// return {
				// 	title: '【天下工人】',
				// 	path: '/pagesB/jobinfo/jobLeavetwoInfo?' + '&cardID=' + uni.getStorageSync('cardID'),
				// 	imageUrl: 'https://xgr.oss-cn-hangzhou.aliyuncs.com/icon/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20230327160119.png'
				// }
			},
			onShareTimeline(res) {
				console.log("++++++++2222222++++++++++++++", res, uni.getStorageSync('userid'), uni.getStorageSync(
					'swiper_info'), this.itemId)
				if (this.shareImagePath) {
					return {
						title: this.item.title,
						query: '/pagesB/jobinfo/jobLeavetwoInfo?' + '&inviteUserId=' + uni.getStorageSync('userid') +
							'&cardID=' + this.itemId,
						imageUrl: this.shareImagePath
						// imageUrl: 'https://xgr.oss-cn-hangzhou.aliyuncs.com/icon/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20230327160119.png'
					}
				}

				// return {
				// 	title: '【天下工人】',
				// 	query: '/pagesB/jobinfo/jobLeavetwoInfo?' + '&cardID=' + uni.getStorageSync('swiper_info'),
				// 	imageUrl: 'https://xgr.oss-cn-hangzhou.aliyuncs.com/icon/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20230327160119.png'
				// }
			}
		}
	}
</script>
<style>
	@import url("@/static/css/publics.css");
	@import url("@/static/css/myfollow.css");
</style>
<style lang="scss">
	/* 白色 */
	$zy-classic-white: #ffffff;

	/* 灰色 */
	$zy-classic-grey: #e9e9e9;
	$zy-dark-grey: #999999;

	.testview {
		display: flex;
		flex-direction: row;
		height: 45px;
		background-color: white;
		padding: 10px;
		// grid-template-rows: repeat(4, 1fr);
		// display: flex;
		// flex-direction: row;
		// justify-content: space-between;
	}

	.text-container {
		flex: 1;
		padding-right: 10px;
		/* 可根据需求调整间距 */
		overflow: hidden;
		/* 防止文本溢出 */
		white-space: nowrap;
		/* 文本不换行 */
		text-overflow: ellipsis;
		/* 文本溢出显示省略号 */
	}

	.button {
		/* 按钮样式根据需求自定义 */
	}

	.jobAddress {
		display: flex;
		flex-direction: column;
		padding: 10px;
		border-radius: 5px;
		background-color: #ffffff;
		margin-top: 10px;
	}

	.jobInfo {
		display: flex;
		flex-direction: column;
		padding: 10px;
		border-radius: 5px;
		background-color: #ffffff;
		margin-top: 10px;
	}


	.userInfo {
		display: flex;
		flex-direction: row;
		padding: 10px;
		border-radius: 5px;
		background-color: #ffffff;
		margin-top: 10px;
		justify-content: space-between;
	}

	.container {
		width: 100%;
		height: 100vh;
		background-color: $zy-classic-white;
	}

	.text {
		padding: 20rpx 0 0 20rpx;
		font-size: 26rpx;
		color: $zy-dark-grey;
	}

	.tag_container {
		display: flex;
		align-items: center;
		flex-direction: row;
		flex-wrap: wrap;
	}

	.zy_tag_add {
		width: 150rpx;
		height: 50rpx; //medium：45rpx；small：40rpx；mini：35rpx
		padding: 5rpx 15rpx;
		margin: 5rpx 8rpx;
		border: 1rpx solid $zy-classic-grey;
		border-radius: 10rpx;
		text-align: center;
	}

	.zy_tag_add_input {
		margin: auto;
		width: 150rpx;
		height: 50rpx; //medium：45rpx；small：40rpx；mini：35rpx
		font-size: 28rpx; //medium：26rpx；small：24rpx；mini：22rpx
	}

	page {
		width: 100%;
		height: 100%;
		background-color: #ffffff;
	}

	.tag {
		// margin: 10px;
		margin-top: 10px;
		margin-right: 10px;
		margin-bottom: 20px;
	}

	.callbtn {
		// margin-right: 15px;
		// width: 80px;
		// height: 30px;
		// font-size: 13px;
		// // margin: auto;
		// text-align: center;
		// // letter-spacing: 3px;
		// // text-indent: 3px;
		// writing-mode: vertical-lr;
		margin-top: -10rpx;
		height: 45px;
		line-height: 60rpx;
		width: 100%;
		text-align: center;
		color: #fff;
		border-radius: 8rpx;
		background: #0575ff;
		font-size: 16px;
		border: none;
		box-shadow: none;
	}

	.zanweiview {
		height: 150px;
	}

	.tool_bottom {
		width: 100%;
		// padding: 10px;
		position: fixed;
		left: 0;
		bottom: 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-top: 1px solid #e3e3e3;
		background-color: white;
		height: 50px;

		.fabuview {
			height: 45px;
			display: flex;
			justify-content: center;
			text-align: center;
			align-items: center;
			border-radius: 3px;
			background-color: #0575FF;
			width: 100%;
			margin-left: 20px;
			margin-right: 20px;

			.callbtn {
				padding: 10px;
				height: 45px;
				// line-height: 60rpx;
				width: 100%;
				text-align: center;
				color: #fff;
				// border-radius: 8rpx;
				background: #0575ff;
				font-size: 16px;
				border: none;
				box-shadow: none;
				border-width: 0px;
			}

			// .lab-item-left {
			// 	text-align: center;
			// 	color: white;
			// }
		}

	}

	.contentLab {
		overflow: hidden;
		-webkit-line-clamp: 2;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
	}

	.lineview {
		background-color: #F6F6F6;
		width: 100%;
		height: 5px;
	}

	.centerview {
		margin: 10px;
		background-color: white;
		// margin-top: 15px;
		// margin-: 15px;
	}

	.bgviewtop_buttomview {
		margin-left: 10px;
		// padding-bottom: 10px
		background-color: white;
		display: flex;
		flex-direction: row;
		// height: 45px;
		// margin-top: 20px;

		.addr {
			display: flex;
			flex-direction: column;
			color: #a1a1a1;
			font-size: 24rpx;
		}

		.callview {
			margin-top: 15px;
			height: 30px;
			width: 35%;

			.callbtn {
				margin-top: -10rpx;
				height: 60rpx;
				line-height: 60rpx;
				width: 180rpx;
				text-align: center;
				color: #fff;
				border-radius: 8rpx;
				background: #0575ff;
				font-size: 28rpx;

			}
		}
	}

	.bgviewtop {
		background-color: white;
		display: flex;
		flex-direction: column;
		border-radius: 5px;
		padding: 10px;

		.topview {
			display: flex;
			flex-direction: row;

			// height: 30px;
			.top-left {
				// background-color: yellow;
				background-color: white;
				width: 65%;
				display: flex;
				justify-content: flex-start;
				padding-left: 10px;
				align-items: center;

				// justify-items: center;
				.lab-item-left {
					font-family: PingFang SC-Bold;
					text-align: left;
					font-size: 29rpx;
					font-weight: bold;
					color: #0F0F0F;
					display: -moz-box;
					// -moz-line-clamp: 2;
					-moz-box-orient: vertical;
					overflow-wrap: break-word;
					word-break: break-all;
					// white-space: nowrap; //不换行
					// text-overflow: ellipsis; //超出部分省略号
					// overflow: hidden;
				}
			}

			.top-right {
				// background-color: goldenrod;
				background-color: white;
				width: 35%;
				display: flex;
				justify-content: flex-end;
				padding-right: 10px;
				text-align: center;
				align-items: center;

				// justify-items: center;
				.lab-item-right {
					font-family: PingFang SC-Bold;
					text-align: right;
					font-size: 27rpx;
					font-weight: bold;
					color: #0575FF;
					display: -moz-box;
					-moz-line-clamp: 1;
					-moz-box-orient: vertical;
					overflow-wrap: break-word;
					word-break: break-all;
					white-space: normal;
					overflow: hidden;
				}
			}
		}
	}
</style>